<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
	<!--图片路径-->
	<link rel="icon" href="img/tyust.png">
	<!--标题-->
    <title>2019级毕业实习</title>
  </head>
 <body>
	<h3>表单</h3><!--h1到h6共6级标题，越来越大-->
	<form action="https://ssl.zc.qq.com/v3/index-chs.html" action="post"><!--表单-->
		<!--placeholder：文本框里面的提醒-->
		姓名<input type="text" placeholder="请输入姓名"/>    <span style="color: red">姓名输入应为2-10个字符</span>
		<br><!--换行-->
		<br>
		身份证号<input type="text" placeholder="请输入身份证号"/>    <span style="color: red">身份证号为大陆身份证号</span>
		<br>
		<br>
		性别<input type="radio" name="gender"/>男<!--radio：单选按钮-->
		    <input type="radio" name="gender"/>女
		<br>
		<br>
		出生年月<input type="date"/>
		<br>
		<br>
		籍贯<select><!--下拉选项-->
			<option>重庆</option><!--option：选项-->
			<option>吉林</option>
			<option>山西</option>
			<option>陕西</option>
			<option>河北</option>
		</select>
		<br>
		<br>
		爱好<input type="checkbox"/>唱<!--checkbox:选择可多选-->
			<input type="checkbox"/>跳
			<input type="checkbox"/>rap
			<input type="checkbox"/>篮球
		<br>
		<br>
		照片<input type="file"/><!--file:上传文件--><span style="color: red">照片为2寸蓝底照片</span>
		<br>
		<br>
		密码<input type="password" placeholder="请输入密码"/>    <span style="color: red">密码最少为9位</span>
		<br>
		<br>
		<!--textarea:多行文本框-->
		备注<textarea placeholder="其他信息" cols="100" rows="5"></textarea><!--cols：列数，rows：行数-->
		<br>
		<br>
		<input type="submit" value="注册"/><!--submit:提交表单(通过form后面的action跳转到其他网站)-->
		<input type="reset" value="重填"/><!--reset:清除默认样式 value:按钮内容-->
	</form>
	<h3>超链接</h3>
	<a href="https://www.tyust.edu.cn/">太原科技大学官网</a>
	<a href="https://pvp.qq.com/">dddd官网</a>
	<h3>图片</h3>
	<img src="img/tyust.png" width="250px"/><!--width:宽度 px:像素（因为宽度和高度（height）等比例缩放，所以写一个就行）-->
	<h3>表格</h3>
	<table border="1px" width="500px"><!--border:边框-->
		<tr>
			<td>姓名</td>
			<td>年龄</td>
			<td>性别</td>
			<td>是否生成</td>
		</tr><!--表示第一行中有三列-->
		<tr>
			<td>张三</td>
			<td>21</td>
			<td>男</td>
			<td>
				<button>生成</button><!--button:按钮--> 
			</td>
		</tr><!--第二行-->
		<tr>
			<td>李四</td>
			<td>22</td>
			<td>男</td>
			<td>
				<button>生成</button>
			</td>
		</tr><!--第三行-->
	</table>
	<h3>div使用</h3><!--div:是网页上的区域，一个网页可以分为N多个DIV，一般用于做网页布局-->
	<div>
		<img src="img/tyust.png"/>
		科大、计算机与技术学院、智能科学与技术
	</div>
	<h3>span的用法</h3><!--span:一般用提示，放提示的文字-->
	<input type="text"/>    <span style="color: red">用户输入不能为空</span>
	<h3>列表</h3>
	<ul><!--无序列表-->
		<li>a</li>
		<li>b</li>
		<li>c</li>
	</ul>
	<ol><!--有序列表-->
		<li>a</li>
		<li>b</li>
		<li>c</li>
	</ol>
  </body>
</html>
